<template>
  <div>
    <el-row type="left" justify="space-around">
      <el-col :span="6"
        ><el-input
          placeholder="请输入搜索关键词"
          prefix-icon="el-icon-search"
          size="medium"
        >
          <el-button
            type="info"
            size="medium"
            slot="append"
            icon="el-icon-search"
          ></el-button>
        </el-input>
      </el-col>
      <el-col :span="11"></el-col>
      <el-col :span="7">
        <el-button size="small" type="primary" @click="buffer.Bufferfrom = true"
          >添加</el-button
        ></el-col
      >
    </el-row>
    <list
      :mylist="mylist"
      :clslist="clslist"
      @edit="editMenu"
      @remove="removeMenu"
    ></list>
    <inlist
      ref="formMenu"
      :mylist="mylist"
      :buffer="buffer"
      @channel="getlist"
    ></inlist>
  </div>
</template>

<script>
import list from "../menu/components/list";
import inlist from "../menu/components/increase";
export default {
  name: "",
  components: {
    list,
    inlist,
  },
  data() {
    return {
      input: "",
      mylist: [],
      clslist: {},
      buffer: {
        Bufferfrom: false,
      },
    };
  },
  created() {},
  mounted() {
    this.getlist();
  },
  methods: {
    getlist() {
      this.$api.reqGetCate({ istree: true }).then((res) => {
        console.log(res);
        this.mylist = res.data.list;
        console.log(this.mylist);
      });
    },
    editMenu(info) {
      let { index, row } = info;
      delete row.children;
      this.$refs.formMenu.form = JSON.parse(JSON.stringify(row));
      this.buffer.Bufferfrom = true;
    },
    removeMenu(info) {
      let { index, row } = info;
      this.$confirm("此操作将永久删除该文件, 是否继续?", "温馨提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(async () => {
          try {
            let res = await this.$api.reqDel({ id: row.id });
            console.log('返回结果：', res)
            this.mylist = res.data.list;
          } catch (error) {
            console.log(error);
          }
          this.$message({
            type: "success",
            message: "删除成功!",
          });
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消删除",
          });
        });
    },
  },
};
</script>
<style scoped lang="scss">
.el-row {
  margin-top: 20px;
}
</style>
